<template>
  <div class="medicine_info_list">
    <!--药品信息列表操作 -->
    <el-row class="medicine_operation">
      <el-col :span="20">
        <div class="title">药品信息列表</div>
      </el-col>
      <el-col :span="4">
        <el-tooltip class="item" effect="light" content="采购" placement="top">
          <el-button v-show="!isAdministrator" type="primary" circle class="iconfont icon-ruku purchaseBtn" @click="showPurchaseMedicinePopus"></el-button>
        </el-tooltip>
        <el-tooltip class="item" effect="light" content="添加" placement="top">
          <el-button v-show="isAdministrator" type="primary" class="iconfont icon-tianjia" @click="showAddmedicine = true" circle></el-button>
        </el-tooltip>
        <el-tooltip class="item" effect="light" content="修改" placement="top">
          <el-button type="warning" v-show="isAdministrator" class="iconfont icon-xiugai" @click="editMedicinePopups" circle></el-button>
        </el-tooltip>
        <el-tooltip class="item" effect="light" content="删除" placement="top">
          <el-button type="danger" v-show="isAdministrator" class="iconfont icon-changyonggoupiaorenshanchu" @click="deleteMedicinePopups" circle></el-button>
        </el-tooltip>
      </el-col>
    </el-row>
    <!-- 药品信息列表列表 -->
    <el-table
        :data="medicineList"
        border
        @selection-change="selectTarget"
    >
      <!-- 全选 -->
      <el-table-column type="selection" width="60"/>
      <!-- 展开行 -->
      <el-table-column type="expand">
        <template slot-scope="scope">
          <el-card>
            <!-- 药品信息 -->
            <el-divider content-position="left">药品信息</el-divider>
            <div class="description">类别描述：{{scope.row.medicineTypeVo.description}}</div>
            <div class="specification">规格：{{scope.row.specification}}</div>
            <div class="efficacy">作用：{{scope.row.efficacy}}</div>
          </el-card>
        </template>
      </el-table-column>
      <!-- 药品图片 -->
      <el-table-column prop="img" label="药品图片" width="150" align="center">
        <template slot-scope="scope">
          <img class="medicineImg" :src="'http://47.107.237.85/mdps/img/'+scope.row.img" alt="图片加载错误">
        </template>
      </el-table-column>
      <!-- 药品名称 -->
      <el-table-column prop="name" label="药品名称" width="150" align="center"/>
      <!-- 药品类型 -->
      <el-table-column prop="medicineTypeVo.type" label="药品类型" width="120px" align="center"/>
      <!-- 药品等级 -->
      <el-table-column prop="medicineTypeVo.level" label="药品等级" width="100px" align="center"/>
      <!-- 进货价格 -->
      <el-table-column prop="purchasePrice" label="进货价格" width="100px" align="center"/>
      <!-- 零售价格 -->
      <el-table-column prop="retailPrice" label="零售价格" width="100px" align="center"/>
      <!-- 生产日期 -->
      <el-table-column prop="manufactureData" label="生产日期" width="125px" align="center"/>
      <!-- 有效日期 -->
      <el-table-column prop="expirationDate" label="有效日期" width="125px" align="center"/>
      <!-- 是否医保-->
      <el-table-column prop="medicalInsurance" label="是否医保" align="center">
        <template slot-scope="scope">
          <el-tag :type="scope.row.medicalInsurance == '医保' ? '' : 'info'">{{ scope.row.medicalInsurance }}</el-tag>
        </template>
      </el-table-column>
      <!-- 是否捐赠物资 -->
      <el-table-column prop="donate" label="是否捐赠物资" width="110px" align="center">
        <template slot-scope="scope">
          <el-tag :type="scope.row.donate == '捐赠' ? 'success' : 'info'">{{ scope.row.donate }}</el-tag>
        </template>
      </el-table-column>
    </el-table>
    <!-- 员工分页 -->
    <el-pagination
        @size-change="handleMedicineTableSizeChange"
        @current-change="handleMedicineTableCurrentChange"
        :current-page="medicinePageList.currentPage"
        :page-sizes="[5, 10, 15, 20, 30]"
        :page-size="5"
        layout="total, sizes, prev, pager, next, jumper"
        :total="medicineTotal">
    </el-pagination>
    <!-- 添加药品信息弹出层 -->
    <el-dialog  title="添加药品信息" :visible.sync="showAddmedicine" width="80%" @close="handleCloseAddMedicine" top="10vh" append-to-body>
        <el-form inline :model="addMedicineForm" ref="addMedicineFormRef" :rules="addMedicineFormRules">
            <!-- 药品名称 -->
            <el-form-item prop="name">
                <el-input placeholder="请输入药品名称" v-model="addMedicineForm.name" clearable>
                  <template slot="prepend">药品名称</template>
                </el-input>
            </el-form-item>
            <!-- 进货价格 -->
            <el-form-item prop="purchasePrice">
              <el-input placeholder="请输入进货价格" v-model="addMedicineForm.purchasePrice" clearable>
                <template slot="prepend">进货价格</template>
              </el-input>
            </el-form-item>
            <!-- 零售价格 -->
            <el-form-item prop="retailPrice">
              <el-input placeholder="请输入零售价格" v-model="addMedicineForm.retailPrice" clearable>
                <template slot="prepend">零售价格</template>
              </el-input>
            </el-form-item>
            <!-- 药品类别 -->
            <el-form-item prop="medicineType">
              <el-select clearable placeholder="请选择药品类别" v-model="addMedicineForm.medicineType">
                <el-option
                  v-for="item in medicineTypeDownBox"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value">
                </el-option>
              </el-select>
            </el-form-item>
            <!-- 生产日期 -->
            <el-form-item prop="manufactureData">
              <el-date-picker
                v-model="addMedicineForm.manufactureData"
                align="center"
                type="date"
                placeholder="请选择生产日期"
                value-format="yyyy-MM-dd">
              </el-date-picker>
            </el-form-item>
            <!-- 有效日期 -->
            <el-form-item prop="expirationDate">
              <el-date-picker
                v-model="addMedicineForm.expirationDate"
                align="center"
                type="date"
                placeholder="请选择有效日期"
                value-format="yyyy-MM-dd">
              </el-date-picker>
            </el-form-item>
            <!-- 是否医保 -->
            <el-form-item prop="medicalInsurance">
              <el-select clearable placeholder="是否医保" v-model="addMedicineForm.medicalInsurance">
                  <el-option key="医保" label="医保" value="医保"></el-option>
                  <el-option key="非医保" label="非医保" value="非医保"></el-option>
              </el-select>
            </el-form-item>
            <!-- 是否捐赠物资 -->
            <el-form-item prop="donate">
              <el-select clearable placeholder="是否捐赠物资" v-model="addMedicineForm.donate">
                  <el-option key="捐赠" label="捐赠" value="捐赠"></el-option>
                  <el-option key="非捐赠" label="非捐赠" value="非捐赠"></el-option>
              </el-select>
            </el-form-item>
            <!-- 药品作用 -->
            <el-form-item prop="efficacy">
              <el-input :rows="4" class="AddMedicineEfficacy" placeholder="请输入药品作用" type="textarea" v-model="addMedicineForm.efficacy"></el-input>
            </el-form-item>
            <!-- 药品规格 -->
            <el-form-item prop="specification">
              <el-input :rows="4" class="AddMedicineSpecification" placeholder="请输入药品规格" type="textarea" v-model="addMedicineForm.specification"></el-input>
            </el-form-item>
            <!-- 图片 -->
            <el-form-item prop="img">
              <el-tooltip class="item" effect="light" content="上传图片" placement="right">
                <el-upload 
                ref="uploadMedicineImg"
                name="medicineImg"
                :limit="1" 
                action="http://47.107.237.85/mdps/workbench/medicine/uploadMedicineImg.do" 
                list-type="picture-card" 
                :on-success="handleAddSuccessImg">
                <i class="el-icon-plus"></i>
              </el-upload>
              </el-tooltip>
              
            </el-form-item>
        </el-form>
        <span slot="footer">
            <el-button @click="showAddmedicine = false">取 消</el-button>
            <el-button type="primary" @click="addmedicine">确 认</el-button>
        </span>
    </el-dialog>
    <!-- 修改药品信息弹出层 -->
    <el-dialog  title="修改药品信息" :visible.sync="showEditmedicine" width="80%" top="10vh" append-to-body>
        <el-form inline :model="editMedicineForm" ref="editMedicineFormRef" :rules="editMedicineFormRules">
            <!-- 药品名称 -->
            <el-form-item prop="name">
                <el-input placeholder="请输入药品名称" v-model="editMedicineForm.name" clearable>
                  <template slot="prepend">药品名称</template>
                </el-input>
            </el-form-item>
            <!-- 进货价格 -->
            <el-form-item prop="purchasePrice">
              <el-input placeholder="请输入进货价格" v-model.number="editMedicineForm.purchasePrice" clearable>
                <template slot="prepend">进货价格</template>
              </el-input>
            </el-form-item>
            <!-- 零售价格 -->
            <el-form-item prop="retailPrice">
              <el-input placeholder="请输入零售价格" v-model.number="editMedicineForm.retailPrice" clearable>
                <template slot="prepend">零售价格</template>
              </el-input>
            </el-form-item>
            <!-- 药品类别 -->
            <el-form-item prop="medicineType">
              <el-select clearable placeholder="请选择药品类别" v-model="editMedicineForm.medicineType">
                <el-option
                  v-for="item in medicineTypeDownBox"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value">
                </el-option>
              </el-select>
            </el-form-item>
            <!-- 生产日期 -->
            <el-form-item prop="manufactureData">
              <el-date-picker
                v-model="editMedicineForm.manufactureData"
                align="center"
                type="date"
                placeholder="请选择生产日期"
                value-format="yyyy-MM-dd">
              </el-date-picker>
            </el-form-item>
            <!-- 有效日期 -->
            <el-form-item prop="expirationDate">
              <el-date-picker
                v-model="editMedicineForm.expirationDate"
                align="center"
                type="date"
                placeholder="请选择有效日期"
                value-format="yyyy-MM-dd">
              </el-date-picker>
            </el-form-item>
            <!-- 是否医保 -->
            <el-form-item prop="medicalInsurance">
              <el-select clearable placeholder="是否医保" v-model="editMedicineForm.medicalInsurance">
                  <el-option key="医保" label="医保" value="医保"></el-option>
                  <el-option key="非医保" label="非医保" value="非医保"></el-option>
              </el-select>
            </el-form-item>
            <!-- 是否捐赠物资 -->
            <el-form-item prop="donate">
              <el-select clearable placeholder="是否捐赠物资" v-model="editMedicineForm.donate">
                  <el-option key="捐赠" label="捐赠" value="捐赠"></el-option>
                  <el-option key="非捐赠" label="非捐赠" value="非捐赠"></el-option>
              </el-select>
            </el-form-item>
            <!-- 药品作用 -->
            <el-form-item prop="efficacy">
              <el-input :rows="4" class="AddMedicineEfficacy" placeholder="请输入药品作用" type="textarea" v-model="editMedicineForm.efficacy"></el-input>
            </el-form-item>
            <!-- 药品规格 -->
            <el-form-item prop="specification">
              <el-input :rows="4" class="AddMedicineSpecification" placeholder="请输入药品规格" type="textarea" v-model="editMedicineForm.specification"></el-input>
            </el-form-item>
            <!-- 图片 -->
            <el-form-item prop="img">
              <el-tooltip class="item" effect="light" content="上传图片" placement="right">
                <el-upload 
                ref="uploadMedicineImg"
                name="medicineImg"
                :limit="1" 
                action="http://47.107.237.85/mdps/workbench/medicine/uploadMedicineImg.do" 
                list-type="picture-card" 
                :on-success="handleEditSuccessImg">
                <i class="el-icon-plus"></i>
              </el-upload>
              </el-tooltip>
              
            </el-form-item>
        </el-form>
        <span slot="footer">
            <el-button @click="showEditmedicine = false">取 消</el-button>
            <el-button type="primary" @click="editMedicine">确 认</el-button>
        </span>
    </el-dialog>
    <!-- 删除药品信息弹出层 -->
    <el-dialog title="删除药品信息" :visible.sync="showDeleteMedicine" width="30%" append-to-body>
      <el-row>
          <el-col :span="3">
            <svg t="1652248818186" class="icon" viewBox="0 0 1040 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4020" width="32" height="32"><path d="M133.534106 982.154208c-78.393906 0-113.368619-57.111137-77.716004-126.943393L444.214002 94.571489c35.652615-69.819703 95.023424-70.359514 131.931412-1.200974L983.376105 856.40342c36.916357 69.166909 2.975236 125.759158-75.410301 125.759157H133.534106v-0.008369z" fill="#FFB624" p-id="4021"></path><path d="M203.655099 894.734165c-63.208068 0-91.412132-50.687808-62.668258-112.661425l313.17809-675.060497c28.743874-61.965248 76.619645-62.44229 106.380372-1.062883l328.372297 677.182078c29.764912 61.387776 2.397764 111.611096-60.801936 111.611096H203.655099v-0.008369z" fill="#FFD91C" p-id="4022"></path><path d="M468.442715 376.22296v223.305883c0 28.88615 23.416905 52.30724 52.30724 52.307239 28.88615 0 52.30724-23.42109 52.30724-52.307239V376.22296c0-28.890335-23.42109-52.30724-52.30724-52.30724-28.890335 0-52.30724 23.416905-52.30724 52.30724zM468.442715 765.819834v33.254851c0 28.881965 23.416905 52.30724 52.30724 52.30724 28.88615 0 52.30724-23.425274 52.30724-52.30724v-33.254851c0-28.88615-23.42109-52.30724-52.30724-52.307239-28.890335 0-52.30724 23.42109-52.30724 52.307239z" fill="#6E6E96" p-id="4023"></path><path d="M133.534106 961.231312c-30.354937 0-53.006064-9.687301-63.781356-27.28764s-9.105644-42.180558 4.699283-69.217124l388.3959-760.635141c13.327885-26.103405 30.47629-41.159521 47.051408-41.310166 16.570934-0.150645 33.991337 14.591628 47.787894 40.443958l407.230692 763.032905c14.256861 26.714353 16.407735 50.934698 6.046717 68.20864-10.361018 17.265574-32.727594 26.768753-62.99884 26.768753H133.534106a20.922896 20.922896 0 1 1 0-0.004185z m0 41.849977h774.440067c45.549144 0 80.661948-16.729948 98.881606-47.101623 18.219658-30.37586 16.441212-69.242232-5.013126-109.435115L594.603593 83.520016c-21.701228-40.661556-51.913889-62.89004-85.085048-62.588751-33.171159 0.30129-62.977917 23.07377-83.942659 64.124491L37.179986 845.695081c-20.676006 40.502542-21.784919 79.59488-3.113327 110.100463 18.667408 30.493028 53.98944 47.28156 99.471632 47.28156a20.922896 20.922896 0 0 1-0.004185 0.004185z" fill="#6E6E96" p-id="4024"></path></svg>
          </el-col>
          <el-col :span="21">
            <div class="deleteMedicineMsg">确定要删除这{{selectedMedicineNumber}}条记录吗？</div>
          </el-col>
      </el-row>
      <span slot="footer" class="dialog-footer">
        <el-button @click="showDeleteMedicine = false">再想想</el-button>
        <el-button type="primary" @click="deleteMedicine">想好了</el-button>
      </span>
    </el-dialog>
    <!-- 采购弹出层 -->
    <el-dialog  title="采购药品信息" :visible.sync="showPurchaseMedicine" width="80%" @close="handleClosePurchaseMedicine" top="10vh" append-to-body>
        <el-form inline :model="purchaseMedicineForm" ref="purchaseMedicineFormRef" :rules="purchaseMedicineFormRules">
            <!-- 采购供应商 -->
            <el-form-item prop="supplier">
              <el-select clearable placeholder="请选择供应商" v-model="purchaseMedicineForm.supplier">
                  <el-option
                    v-for="item in supplierDownBox"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                  </el-option>
              </el-select>
            </el-form-item>
            <!-- 采购仓库名 -->
            <el-form-item prop="warehouse">
              <el-select clearable placeholder="请选择仓库" v-model="purchaseMedicineForm.warehouse">
                  <el-option
                    v-for="item in warehouseDownBox"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                  </el-option>
              </el-select>
            </el-form-item>
            <!-- 购买数量 -->
            <el-form-item prop="number">
              <el-input placeholder="请输入采购数量" v-model.number="purchaseMedicineForm.number" clearable>
                <template slot="prepend">采购数量</template>
              </el-input>
            </el-form-item>
        </el-form>
        <span slot="footer">
            <el-button @click="showPurchaseMedicine = false">取 消</el-button>
            <el-button type="primary" @click="purchaseMedicine">确 认</el-button>
        </span>
    </el-dialog>
  </div>
</template>

<script>
  export default {
    name: 'MedicineList',
    data() {
      return {
        /* 药品信息列表 */
        medicineList: [],
        /* 药品信息表分页信息 */
        medicinePageList:{
            pageNo: 1,
            pageSize: 5,
            currentPage: 1,
            name: '',
            medicineType: '',
            purchasePrice: '',
            retailPrice: '',
            manufactureData: '',
            expirationDate: '',
            medicalInsurance: '',
            donate: '',
        },
        /* 药品表总条数 */
        medicineTotal: 0,

        /* 采购弹出层 */
        showPurchaseMedicine: false,
        /* 采购药品表单 */
        purchaseMedicineForm: {
          currentUserId: '',
          medicine: '',
          number: '',
          supplier: '',
          warehouse: '',
          aggregateAmount: '',
          purchasePrice: '',
        },
        /* 采购药品表单验证 */
        purchaseMedicineFormRules: {
          supplier: [
            { required: true, message: '请选择供应商', trigger: 'change' },
          ],
          warehouse: [
            { required: true, message: '请选择仓库', trigger: 'change' },
          ],
          number: [
            { required: true, message: '请输入采购药品数量', trigger: 'blur' },
            { type: 'number', message: '数量必须为数字值'}
          ],
        },

        /* 选中药品信息个数 */
        selectedMedicineNumber: 0,
        /* 选中药品信息数组 */
        selectedMedicine: [],

        /* 添加药品信息表单 */
        addMedicineForm: {
          currentUserId: '',
          name: '',
          medicineType: '',
          efficacy: '',
          img: '',
          purchasePrice: '',
          retailPrice: '',
          specification: '',
          manufactureData: '',
          expirationDate: '',
          medicalInsurance: '',
          donate: '',
        },
        /* 添加药品信息表单验证 */
        addMedicineFormRules: {
          name: [
            { required: true, message: '请输入药品信息名称', trigger: 'blur' },
          ],
          purchasePrice: [
            { required: true, message: '请输入药品进货价格', trigger: 'blur' },
          ],
          retailPrice: [
            { required: true, message: '请输入药品零售价格', trigger: 'blur' },
          ],
        },
        /* 控制添加药品信息弹出层 */
        showAddmedicine: false,

        /* 修改药品信息表单 */
        editMedicineForm: {
          currentUserId: '',
          name: '',
          medicineType: '',
          efficacy: '',
          img: '',
          purchasePrice: '',
          retailPrice: '',
          specification: '',
          manufactureData: '',
          expirationDate: '',
          medicalInsurance: '',
          donate: '',
        },
        /* 修改药品信息表单验证 */
        editMedicineFormRules: {
          name: [
            { required: true, message: '请输入药品信息名称', trigger: 'blur' },
          ],
        },
        /* 控制修改药品信息弹出层 */
        showEditmedicine: false,

        /* 删除药品信息id组 */
        deleteMedicineIds: [],
        /* 控制删除药品信息弹出层 */
        showDeleteMedicine: false,

        /* 药品类别下拉框数据 */
        medicineTypeDownBox: [],

        /* 供应商下拉框数据 */
        supplierDownBox: [],

        /* 仓库下拉框数据 */
        warehouseDownBox: [],

        /* 判断是否为管理员 */
        isAdministrator: true,
      }
    },
    methods: {
      /* 复选框选择目标事件回调 */
      selectTarget(selection) {
          this.selectedMedicineNumber =  selection.length
          this.selectedMedicine = selection
      },

      /* 分页获得药品信息列表 */
      async getMedicinePageList(medicine) {

        if(medicine != undefined) {
          this.medicinePageList.name = medicine.name
          this.medicinePageList.medicineType = medicine.medicineType
          this.medicinePageList.purchasePrice = medicine.purchasePrice
          this.medicinePageList.retailPrice = medicine.retailPrice
          this.medicinePageList.manufactureData = medicine.manufactureData
          this.medicinePageList.expirationDate = medicine.expirationDate
          this.medicinePageList.medicalInsurance = medicine.medicalInsurance
          this.medicinePageList.donate = medicine.donate
        }

        const { data: res } = await this.$http.post('workbench/medicine/medicinePageList.do',this.medicinePageList)
        if (res.code == '1') {
          this.medicineList = res.others
        } else {
          this.$message.error('获取药品信息表失败!')
        }
      },
      /* 获得药品信息列表总条数 */
      async getMedicineTotal() {
          const { data: res } = await this.$http.post('workbench/medicine/getMedicineTotal.do',this.medicinePageList)
          if (res.code == '1') {
            this.medicineTotal = res.number
          } else {
              this.$message.error('获取目标表总条数失败!')
          }
      },
      /* 处理分页每页显示几行 */
      handleMedicineTableSizeChange(val) {
          this.medicinePageList.pageSize = val
          this.getMedicineTotal()
          this.getMedicinePageList()
      },
      /* 处理分页切换页数 */
      handleMedicineTableCurrentChange(val) {
          this.medicinePageList.pageNo = val
          this.getMedicineTotal()
          this.getMedicinePageList()
      },

      /* 添加药品信息弹出层关闭回调 */
      handleCloseAddMedicine() {
        this.$refs['addMedicineFormRef'].resetFields();
        this.$refs.uploadMedicineImg.clearFiles(); 
      },
      /* 添加药品信息 */
      async addmedicine() {
        this.$refs.addMedicineFormRef.validate(async valid => {
          if (!valid) return
          const { data: res } = await this.$http.post('workbench/medicine/addMedicine.do',this.addMedicineForm)
          if (res.code == '1') {
            this.showAddmedicine = false
            this.$refs['addMedicineFormRef'].resetFields();
            this.getMedicinePageList()
            this.getMedicineTotal()
            this.$message.success('添加药品信息成功!')
          } else {
            this.$message.error('添加药品信息失败!')
          }
        })
      },
      /* 添加药品图片上传成功回调 */
      handleAddSuccessImg(res, file) {
        if (res.code == '1') {
            this.addMedicineForm.img = res.message
          } else {
              this.$message.error('上传图片失败!')
          }
      },

      /* 修改药品信息弹出层 */
      editMedicinePopups() {
        if(this.selectedMedicineNumber > 1) {
            this.$message.error('只能选择一条记录进行修改!')
            return
        }
        if(this.selectedMedicineNumber < 1) {
            this.$message.error('请选择需要修改的记录!')
            return
        }
        this.editMedicineForm = this.selectedMedicine[0]

        this.showEditmedicine = true
      },
      /* 修改药品信息 */
      async editMedicine() {
        const { data: res } = await this.$http.post('workbench/medicine/editMedicine.do',this.editMedicineForm)
        if (res.code == '1') {
          this.getMedicinePageList()
          this.getMedicineTotal()
          this.showEditmedicine = false
          this.$message.success('修改药品信息资料成功!')
        } else {
            this.$message.error('修改用户资料失败!')
        }
      },
      /* 修改药品图片上传成功回调 */
      handleEditSuccessImg(res, file) {
        if (res.code == '1') {
            this.editMedicineForm.img = res.message
          } else {
              this.$message.error('上传图片失败!')
          }
      },

      /* 删除药品信息弹出层 */
      deleteMedicinePopups() {
        if(this.selectedMedicineNumber < 1) {
            this.$message.error('请选择需要删除的记录!')
            return
        }

        this.showDeleteMedicine = true
        for (const medicine of this.selectedMedicine) {
            this.deleteMedicineIds.push(medicine.id)
        }
      },
      /* 删除药品信息 */
      async deleteMedicine() {
        const { data: res } = await this.$http.post('workbench/medicine/deleteMedicine.do',this.deleteMedicineIds)
        if (res.code == '1') {
          this.showDeleteMedicine = false
          this.getMedicinePageList()
          this.getMedicineTotal()
          this.$message.success('删除药品信息成功!')
        } else {
          this.$message.error('删除药品信息失败!')
        }
      },

      /* 采购药品弹出层 */
      showPurchaseMedicinePopus() {
        if(this.selectedMedicineNumber > 1) {
            this.$message.error('只能选择一条药品进行采购!')
            return
        }
        if(this.selectedMedicineNumber < 1) {
            this.$message.error('请选择需要采购的药品!')
            return
        }
        this.purchaseMedicineForm.medicine = this.selectedMedicine[0].id
        this.purchaseMedicineForm.purchasePrice = this.selectedMedicine[0].purchasePrice

        this.showPurchaseMedicine = true
      },
      
      /* 采购药品 */
      async purchaseMedicine() {
        this.$refs.purchaseMedicineFormRef.validate(async valid => {
          if (!valid) return

          this.purchaseMedicineForm.aggregateAmount = this.purchaseMedicineForm.number * this.purchaseMedicineForm.purchasePrice

          const { data: res } = await this.$http.post('workbench/medicine/purchaseMedicine.do',this.purchaseMedicineForm)
          if (res.code == '1') {
            this.showPurchaseMedicine = false
            this.$refs['purchaseMedicineFormRef'].resetFields();
            this.$message.success('采购成功!')
          } else {
            this.$message.error('采购失败!')
          }
        })
      },
      /* 采购药品弹出层关闭回调 */
      handleClosePurchaseMedicine() {
        this.$refs['purchaseMedicineFormRef'].resetFields();
      },

      /* 获得药品类别下拉框数据 */
      async getMedicineTypeData() {
        const { data: res } = await this.$http.get('workbench/medicineType/getMedicineTypeData.do')
        if (res.code == '1') {
          this.medicineTypeDownBox = res.others
        } else {
            console.log('获取药品类别下拉框数据失败!')
        }
      },

      /* 获得供应商下拉框数据 */
      async getSupplierData() {
        const { data: res } = await this.$http.get('workbench/supplier/getSupplierData.do')
        if (res.code == '1') {
          this.supplierDownBox = res.others
        } else {
            console.log('获取药品类别下拉框数据失败!')
        }
      },

      /* 获得仓库下拉框数据 */
      async getWarehouseData() {
        const { data: res } = await this.$http.get('workbench/warehouse/getWarehouseData.do')
        if (res.code == '1') {
          this.warehouseDownBox = res.others
        } else {
            console.log('获取药品类别下拉框数据失败!')
        }
      },

      /* 初始化当前登录用户 */
      getCurrentUser() {
        let user = JSON.parse(window.localStorage.getItem('user'))
        this.addMedicineForm.currentUserId = user.id
        this.editMedicineForm.currentUserId = user.id
        this.purchaseMedicineForm.currentUserId = user.id
      },
      /* 获得权限 */
      async getPrivilege() {
        let user = JSON.parse(window.localStorage.getItem('user'))
        const { data: res } = await this.$http.post('settings/administrator/getPrivilege.do',{
          currentUserId: user.id
        })
        if (res.code == '1') {
          this.isAdministrator = res.others
        } else {
            console.log('判断当前权限失败!')
        }
      }
    },
    created() {
      this.getMedicineTotal()
      this.getCurrentUser()
      this.getMedicineTypeData()
      this.getSupplierData()
      this.getWarehouseData() 
      this.getMedicinePageList()
      this.getPrivilege()
    },
    mounted() {
      this.$bus.$on('getMedicinePageList',this.getMedicinePageList)
      this.$bus.$on('getMedicineTotal',this.getMedicineTotal)
    },
    beforeDestroy() {
      this.$bus.$off('getMedicinePageList')
      this.$bus.$off('getMedicineTotal')
    }
  }
</script>

<style scoped>
/* 药品信息列表操作 */
.medicine_operation {
  background-color: #fff;
  margin: 0px 0px;
  height: 70px;
}
.medicine_operation .title {
  line-height: 70px;
  margin-left: 15px;
  font-weight: bold;
}
.medicine_operation .el-button {
  margin-top: 15px;
}
/* 采购按钮 */
.purchaseBtn {
  float: right;
  margin-right: 50px;
}
/* 药品信息列表 */
.medicine_info_list {
  margin: 0px 20px;
  box-shadow: 0 0 10px rgb(220, 223, 220);
}
/* 药品图片 */
.el-table img {
  width: 120px;
  height: 120px;
}
/* 药品卡片展示 */
.el-table .el-card {
  margin: 10px 30px;
}
/* 类别描述 */
.description {
  margin-bottom: 10px;
}
/* 药品作用 */
.specification {
  margin-bottom: 10px;
}
/* 药品信息分页 */
.el-pagination {
  text-align: center;
  padding: 15px 0px;
  background-color: #fff;
}
.AddMedicineEfficacy {
  width: 520px;
}
.AddMedicineSpecification {
  width: 520px;
}
/* 删除目标弹出层样式 */
.deleteMedicineMsg {
    margin-left: 10px;
    line-height: 35px;
    font-size: 18px;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}
</style>
